<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- <link rel="icon" href="../../favicon.ico"> -->

    <title>个人中心</title>

    <!-- Bootstrap core CSS -->
    <link href="./libs/bootstarp/css/bootstrap.min.css" rel="stylesheet">

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <!-- <link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet"> -->

    <!-- Custom styles for this template -->
    <link href="./css/index.css" rel="stylesheet">
    <link rel="stylesheet" href="./css/user.css">

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <!-- <script src="../../assets/js/ie-emulation-modes-warning.js"></script> -->

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        [v-cloak] {
            display: none !important;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <zdy-nav title="就业信息平台" :nav-list="navList"></zdy-nav>

        <div class="container">
            <form class="form-horizontal user-form">
                <div class="row col-md-offset-2">
                    <div class="form-group col-md-8 ">
                        <label class="col-sm-3 control-label">照片</label>
                        <div class="col-sm-9">
                            <img :src="picPath" alt="" width="100px" height="100px" @click="handleOnClickPic">
                            <input ref="file" type="file" class="form-control" @change="handleOnChange"
                                style="display:none;">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <label for="inputText1" class="col-sm-3 control-label">姓名</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="inputText1" placeholder="请输入姓名"
                                v-model="param.name">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <label for="inputText2" class="col-sm-3 control-label">专业</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="inputText2" placeholder="请输入专业"
                                v-model="param.major">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <label for="inputText3" class="col-sm-3 control-label">联系方式</label>
                        <div class="col-sm-9">
                            <input type="tel" class="form-control" id="inputText3" placeholder="请输入联系方式"
                                v-model="param.contacts">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <label for="inputText4" class="col-sm-3 control-label">毕业学校</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="inputText4" placeholder="请输入毕业学校"
                                v-model="param.shcool">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <label for="inputText5" class="col-sm-3 control-label">个人经历</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="inputText5" placeholder="请输入个人经历"
                                v-model="param.history">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <label for="inputText6" class="col-sm-3 control-label">意向岗位</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="inputText6" placeholder="请输入意向岗位"
                                v-model="param.intention">
                        </div>
                    </div>
                    <div class="form-group col-md-8">
                        <div class="col-sm-offset-2 col-sm-10">
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" v-model="param.hide"> 是否隐藏简历
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <button type="button" class="btn btn-primary" @click="handleOnSubmit">确定</button>
                            <button type="button" class="btn btn-default" @click="handleOnClose">取消</button>
                        </div>
                    </div>
                </div>
            </form>
        </div><!-- /.container -->

        <zdy-footer></zdy-footer>
    </div>

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> -->
    <!-- <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script> -->
    <script src="./libs/jquery/jquery.min.js"></script>
    <script src="./libs/bootstarp/js/bootstrap.js"></script>
    <script src="./libs/vue/vue.js"></script>
    <script src="./tpl/publicTpl.js"></script>
    <script src="./js/utils.js"></script>
    <script src="./js/xhr.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <!-- <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script> -->
    <script>
        var vm = new Vue({
            el: '#app',
            data() {
                return {
                    navList: [{ text: '首页', path: './index.html' }],
                    param: {
                        userId: '',
                        name: '',
                        major: '',
                        contacts: '',
                        shcool: '',
                        history: '',
                        intention: '',
                        picture: '11111',
                        hide: false
                    },
                    url: ''
                }
            },
            created() {
                var self = this;
                var user = auth();
                if (user) {
                    var param = {
                        userId: user.id
                    }
                    xhr.send('/pub/iface/job/getUser', param, function (res) {
                        self.param = Object.assign(self.param, res.user)
                        self.param.userId = user.id;
                    })
                }
            },
            computed: {
                picPath() {
                    return this.url !== '' ? this.url : './img/add.png'
                }
            },
            methods: {
                handleOnSubmit() {
                    if (this.param.picture == '') {
                        alert('头像不能为空')
                    } else if (this.param.name == '') {
                        alert('姓名不能为空');
                    } else if (this.param.major == '') {
                        alert('专业不能为空')
                    } else if (this.param.contacts == '') {
                        alert('联系方式不能为空')
                    } else if (this.param.shcool == '') {
                        alert('学校不能为空')
                    } else if (this.param.history == '') {
                        alert('个人经历不能为空')
                    } else if (this.param.intention == '') {
                        alert('意向岗位不能为空')
                    } else {
                        xhr.send('/pub/iface/job/User', this.param, function (res) {
                            window.location.replace('./index.html')
                        })
                    }
                },
                handleOnClose() {
                    window.history.back();
                },
                handleOnChangeHide(event) {
                    this.param.hide = event.target.checked;
                },
                handleOnChange(event) {
                    var self = this;
                    var files = event.target.files[0];
                    var fd = new FormData();
                    fd.append('file', files);
                    xhr.upload('/pub/iface/job/upload', fd, function (res) {
                        self.param.picture = res.filename;
                        self.url = res.url;
                    })
                },
                handleOnClickPic: function () {
                    this.$refs.file.click();
                }
            },
        })
    </script>
</body>

</html>